<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>12366座席智能提示</title>
</head>
<body>
<div class="content-wrapper">
  <h3>服务管理与监控/12366座席智能提示</h3> 
   <div class="panel panel-default">
               <div class="panel-heading">查询检索</div>
               <div class="panel-body">
                  <form role="form" class="form-inline">
                     <div class="form-group">
                           <label class="control-label">来电号码:</label>
                           
                              <input type="text" class="form-control" value="">
                        
                           
                        </div>
                        &nbsp;&nbsp;&nbsp;
                          <div class="form-group">
                           <label class="control-label">身份证号码:</label>
                              <input type="text" class="form-control" value="">
                           
                           
                        </div>
                     
                     <button type="submit" class="btn btn-default btn-primary"><em class="fa fa-search"></em>查询</button>
                  </form>
               </div>
            </div>
     <div role="tabpanel" class="panel">
        <!-- Nav tabs-->
        <ul role="tablist" class="nav nav-tabs nav-justified">
            <li role="presentation" class="active">
                <a href="#home" aria-controls="home" role="tab" data-toggle="tab">
                    <em class="fa icon-user fa-fw"></em>&nbsp;纳税人信息</a>
            </li>
            <li role="presentation">
                <a href="#home1" aria-controls="profile" role="tab" data-toggle="tab">
                    <em class="fa icon-briefcase fa-fw"></em>&nbsp;法人信息</a>
            </li>
            <li role="presentation">
                <a href="#home2" aria-controls="profile" role="tab" data-toggle="tab">
                    <em class="fa fa-newspaper-o fa-fw"></em>&nbsp;企业信息</a>
            </li>
            <li role="presentation">
                <a href="#home3" aria-controls="profile" role="tab" data-toggle="tab" >
                    <em class="fa icon-call-in fa-fw"></em>&nbsp;通话智能分析</a>
            </li>
        </ul>
        <!-- Tab panes-->
        <div class="tab-content p0">
            <div id="home" role="tabpanel" class="tab-pane">
                <!-- START list group-->
                <div class="panel panel-default">
                    <div class="panel-body">
                    	  <form method="get" action="/" class="form-horizontal">
                    <fieldset>
                        <div class="form-group">
                           <label class="col-sm-2 control-label">纳税人名称:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="某某某家政服务中心">
                           </div>
                           
                           <label class="col-sm-2 control-label">税务登记类型:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="个体工商户税务登记">
                           </div>
                        </div>
                     </fieldset>
                         <fieldset>
                        <div class="form-group">
                           <label class="col-sm-2 control-label">纳税人识别号:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="33322345678888865">
                           </div>
                           
                           <label class="col-sm-2 control-label">证照号码:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="33322345678888865">
                           </div>
                        </div>
                     </fieldset>
                       
                    
                    	  </form>
                    </div>
                </div>
            </div>
            <div id="home1" role="tabpanel" class="tab-pane">
                <!-- START list group-->
                <div class="panel panel-default">
                    <div class="panel-body" >
                        <form method="get" action="/" class="form-horizontal">
                        	  <fieldset>
                        <div class="form-group">
                           <label class="col-sm-2 control-label">姓名:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="刘某某">
                           </div>
                           <label class="col-sm-2 control-label">国籍或地区:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="中国">
                           </div>
                         
                        </div>
                     </fieldset>
                      <fieldset>
                        <div class="form-group">
                             <label class="col-sm-2 control-label">证件种类:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="身份证">
                           </div>
                           
                           <label class="col-sm-2 control-label">证件号码:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="310020338666376137">
                           </div>
                        </div>
                        
                     </fieldset>
                     <fieldset>
                        <div class="form-group">
                           <label class="col-sm-2 control-label">移动电话:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="137888823863">
                           </div>
                           
                           <label class="col-sm-2 control-label">电子邮箱:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="fdafsa@163.com">
                           </div>
                        </div>
                        
                     </fieldset>
                        </form>
                    </div>
                </div>
        </div>
            <!--企业信息-->
            <div id="home2" role="tabpanel" class="tab-pane">
                <!-- START list group-->
                <div class="panel panel-default">
                    <div class="panel-body">
                        <form role="form" class="form-horizontal">
                            <fieldset>
                        <div class="form-group">
                           <label class="col-sm-2 control-label">名称:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="某某某家政服务中心">
                           </div>
                           
                           <label class="col-sm-2 control-label">注册地址:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="江苏省南京市XXX街某某某道">
                           </div>
                        </div>
                        
                     </fieldset>
                     <fieldset>
                        <div class="form-group">
                           <label class="col-sm-2 control-label">注册邮编:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="210000">
                           </div>
                           
                           <label class="col-sm-2 control-label">注册地联系电话:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="13792238475">
                           </div>
                        </div>
                        
                     </fieldset>
                     <fieldset>
                        <div class="form-group">
                           <label class="col-sm-2 control-label">开业设立日期:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="2014-03-18">
                           </div>
                           
                           <label class="col-sm-2 control-label">批准设立机关:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="工商部门">
                           </div>
                        </div>
                        
                     </fieldset>
                     <fieldset>
                        <div class="form-group">
                           <label class="col-sm-2 control-label">生产经营期限开始:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="2014-03-18">
                           </div>
                           
                           <label class="col-sm-2 control-label">生产经营期限结束:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="2098-03-18">
                           </div>
                        </div>
                        
                     </fieldset>
                     <fieldset>
                        <div class="form-group">
                           <label class="col-sm-2 control-label">生产经营期限开始:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="2014-03-18">
                           </div>
                           
                           <label class="col-sm-2 control-label">生产经营期限结束:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="2098-03-18">
                           </div>
                        </div>
                        
                     </fieldset>
                     <fieldset>
                        <div class="form-group">
                           <label class="col-sm-2 control-label">生产经营地址:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="江苏省南京市XXX街某某某道">
                           </div>
                           
                           <label class="col-sm-2 control-label">生产地联系电话:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="13822938475">
                           </div>
                        </div>
                        
                     </fieldset>
                     <fieldset>
                        <div class="form-group">
                           <label class="col-sm-2 control-label">合伙人数:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="0">
                           </div>
                           <label class="col-sm-2 control-label">雇工人数:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="2">
                           </div>
                        </div>
                        
                     </fieldset>
                     <fieldset>
                        <div class="form-group">
                           <label class="col-sm-2 control-label">网站网址:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="">
                           </div>
                           <label class="col-sm-2 control-label">固定人数:</label>
                           <div class="col-sm-4">
                              <input type="text" class="form-control" value="0">
                           </div>
                        </div>
                        
                     </fieldset>
                     <fieldset>
                        <div class="form-group">
                           <label class="col-sm-2 control-label">经营范围:</label>
                           <div class="col-sm-10">
                              <textarea  rows="3" class="form-control" ></textarea>
                           </div>
                           
                        </div>
                        
                     </fieldset>
                        </form>
                    </div>
                </div>
            </div>
            <div id="home3" role="tabpanel" class="tab-pane active">
             <div class="row" style="padding:10px;">
		       <div class="col-sm-4">
		       	<div class="panel panel-primary">
	                <div class="panel-heading"><em class="fa fa-tasks fa-fw"></em>&nbsp;通话内容分类排序</div>
	                   <div class="panel-body">
	                   	  <div id="echarts-map" style="height: 400px;" ></div>
	                   </div>
	               </div>
		       </div>
		        <div class="col-sm-8">
		        	<div class="panel panel-primary">
		                 <div class="panel-heading"><em class="fa fa-bar-chart fa-fw"></em>&nbsp;历史通话时长</div>
		                    <div class="panel-body">
		                    	<div id="echarts-map2" style="height: 400px;" ></div>
		                    </div>
		                </div>
		        </div>
        </div>
                
                
            </div>
            
            
            
    </div>
            
</div>
</div>

<script type="text/javascript">
require.config({
    paths: {
        echarts: '${ctx}/assets/echarts/build/dist'
    }
});
require(
        [
            'echarts',
            'echarts/chart/bar',
            'echarts/chart/scatter',
            'echarts/chart/pie',
            'echarts/chart/map',
            'echarts/chart/tree',
            'echarts/chart/funnel',
            'echarts/chart/wordCloud'

        ],
        function (ec) {
            var myChart = ec.init(document.getElementById('echarts-map'));
            
            var dataStyle = {
            	    normal: {
            	        label: {show:false},
            	        labelLine: {show:false}
            	    }
            };
           	var placeHolderStyle = {
           	    normal : {
           	        color: 'rgba(0,0,0,0)',
           	        label: {show:false},
           	        labelLine: {show:false}
           	    },
           	    emphasis : {
           	        color: 'rgba(0,0,0,0)'
           	    }
           	};
            var mapOption = {
            		    title: {
            		        text: '热点问题关注',
            		        subtext: '历史排序',
            		        //sublink: 'http://e.weibo.com/1341556070/AhQXtjbqh',
            		        x: 'center',
            		        y: 'center',
            		        itemGap: 20,
            		        textStyle : {
            		            color : 'rgba(30,144,255,0.8)',
            		            fontFamily : '微软雅黑',
            		            fontSize : 25,
            		            fontWeight : 'bolder'
            		        }
            		    },
            		    tooltip : {
            		        show: true,
            		        formatter: "{a} <br/>{b} : {c} ({d}%)"
            		    },
            		    legend: {
            		        orient : 'vertical',
            		        x : document.getElementById('echarts-map').offsetWidth / 2+2,
            		        y : 45,
            		        itemGap:12,
            		        data:['个人代开装饰工程发票所需资料？','双定个体工商户是否需要每个月进行报税和发票月报？','企业取得股息是否需要缴纳企业所得税？','其他']
            		    },
            		    toolbox: {
            		        show : false,
            		        feature : {
            		            mark : {show: true},
            		            dataView : {show: true, readOnly: false},
            		            restore : {show: true},
            		            saveAsImage : {show: true}
            		        }
            		    },
            		    series : [
            		        {
            		            name:'1',
            		            type:'pie',
            		            clockWise:false,
            		            radius : [125, 150],
            		            itemStyle : dataStyle,
            		            data:[
            		                {
            		                    value:55,
            		                    name:'个人代开装饰工程发票所需资料？'
            		                },
            		                {
            		                    value:45,
            		                    name:'invisible',
            		                    itemStyle : placeHolderStyle
            		                }
            		            ]
            		        },
            		        {
            		            name:'2',
            		            type:'pie',
            		            clockWise:false,
            		            radius : [100, 125],
            		            itemStyle : dataStyle,
            		            data:[
            		                {
            		                    value:25, 
            		                    name:'双定个体工商户是否需要每个月进行报税和发票月报？'
            		                },
            		                {
            		                    value:75,
            		                    name:'invisible',
            		                    itemStyle : placeHolderStyle
            		                }
            		            ]
            		        },
            		        {
            		            name:'3',
            		            type:'pie',
            		            clockWise:false,
            		            radius : [75, 100],
            		            itemStyle : dataStyle,
            		            data:[
            		                {
            		                    value:15, 
            		                    name:'企业取得股息是否需要缴纳企业所得税？'
            		                },
            		                {
            		                    value:85,
            		                    name:'invisible',
            		                    itemStyle : placeHolderStyle
            		                }
            		            ]
            		        },{
            		            name:'4',
            		            type:'pie',
            		            clockWise:false,
            		            radius : [55, 75],
            		            itemStyle : dataStyle,
            		            data:[
            		                {
            		                    value:5,
            		                    name:'其他'
            		                },
            		                {
            		                    value:95,
            		                    name:'invisible',
            		                    itemStyle : placeHolderStyle
            		                }
            		            ]
            		        }
            		    ]
            		}
            myChart.setOption(mapOption, true);
            
            var myChart2 = ec.init(document.getElementById('echarts-map2'));
            var mapOption2 = {
            		title : {
            	        text: '',
            	        subtext: ''
            	    },
            	    tooltip : {
            	        trigger: 'axis'
            	    },
            	    legend: {
            	        data:[]
            	    },
            	    toolbox: {
            	    },
            	    calculable : true,
            	    xAxis : [
            	        {
            	            type : 'category',
            	            data : ['1月2日','2月2日','2月3日','4月5日','5月5日','6月4日','7月25日','8月5日','9月3日','10月4日','10月5日','11月1日']
            	        }
            	    ],
            	    yAxis : [
            	        {
            	            type : 'value'
            	        }
            	    ],
            	    series : [
            	        {
            	            name:'通话时长（分钟）',
            	            type:'bar',
            	            itemStyle:{
                                normal:{color:'#485BA7'}, //为每个柱设置颜色
                                barBorderRadius: 5
                            },
            	            data:[15, 25, 35, 17, 45, 55, 15, 24, 33, 22, 15, 19],
            	            barWidth:25,
            	            markPoint : {
            	                data : [
            	                    {type : 'max', name: '最大值'},
            	                    {type : 'min', name: '最小值'}
            	                ]
            	            },
            	            markLine : {
            	                data : [
            	                    {type : 'average', name: '平均值'}
            	                ]
            	            }
            	        }
            	    ]
            }
            myChart2.setOption(mapOption2, true);
            
            
            initTab();
            
        }
        
)
function initTab(){
	$('#home3').removeClass('active');
	$('#home').addClass('active');
}




</script>


</body>

</html>